// 公共底部导航
function fixBottomNav(name) {
    // 创建一个ul
    const ul = document.createElement('ul')
    ul.className = `navmenu dpflex`

    // 添加html内容
    ul.innerHTML = `
        <li id="home" class="${name==='home'?'active':''}"><span class="iconfont icon-home"></span>首页</li>
        <li id="motion" class="${name==='motion'?'active':''}"><span class="iconfont icon-motion"></span>运动</li>
        <li id="circle" class="${name==='circle'?'active':''}"><span class="iconfont icon-circle"></span>圈子</li>
        <li id="me" class="${name==='me'?'active':''}"><span class="iconfont icon-me"></span>我的</li>
        
    `
    // 将div追加到
    document.body.append(ul)
    // console.log(ul);
    home.addEventListener('click', function () {
        location.href = './home.html'
    })
    motion.addEventListener('click', function () {
        location.href = './motion.html'
    })
    circle.addEventListener('click', function () {
        location.href = './circle.html'
    })
    me.addEventListener('click', function () {
        location.href = './me.html'
    })

}
// 运动顶部导航
function sportHeaderNav(name = "run") {
    let div = document.createElement('div')
    div.className = 'top'
    div.innerHTML = `
        <div class="nav dpflex">
            <a class="${name==='run'?'active':''}" href="./motion.html">跑步</a>
            <a class="${name==='ride'?'active':''}" href="./motion-bike.html">骑行</a>
            <a class="${name==='course'?'active':''}" href="./motion-curriculum.html">课程训练</a>
        </div>
    `
    document.querySelector('.motion-app').prepend(div)
}
// 导出
module.exports = {
    fixBottomNav,
    sportHeaderNav
}